import React from "react";
import {Route, Switch, Redirect, NavLink} from "react-router-dom";
import NowPlaying from "./film/NowPlaying";
import ComingSoon from "./film/ComingSoon";
import style from "./css/Film.module.css";

export default function Film() {
    return <div>
        <div style={{height: "200px", backgroundColor: "yellow"}}>轮播图</div>
        <div>
            <ul>
                <li><NavLink activeClassName={style.zyActive} to="/film/nowPlaying">正在热映</NavLink></li>
                <li><NavLink activeClassName={style.zyActive} to="/film/comingSoon">即将上映</NavLink></li>
            </ul>
        </div>
        <div>
            {/*二级路由*/}
            <Switch>
                <Route path="/film/nowPlaying" component={NowPlaying}/>
                <Route path="/film/comingSoon" component={ComingSoon}/>
                <Redirect from="/film" to="/film/nowPlaying"/>
            </Switch>
        </div>
    </div>
}